<div class="filter">
    <div class="button item">
        <button type="button" class="am-btn am-btn-primary add-layer">新加分层</button>
    </div>

    <div class="button item">
        <button type="button" class="am-btn am-btn-primary lock-layer">锁定用户层级</button>
    </div>

    <div class="button item">
        <button type="button" class="am-btn am-btn-primary refresh-layer">重新匹配用户层级</button>
    </div>
</div>

<div style="line-height: 32px;" class="red">
    【操作提示】层级ID越大，优先被匹配到。
</div>
<table class="am-table am-table-bordered am-table-radius am-table-striped am-table-compact" id="result-table" 
    style="min-width: 800px;">
    <thead>
    <tr>
        <th>层级ID</th>
        <th>名称</th>
        
        <th>注册时间(起)</th>
        <th>注册时间(终)</th>
        <th>充值次数</th>
        <th>充值总额</th>
        <th>最大充值</th>
        <th>提现次数</th>
        <th>提现总额</th>

        <th>会员数</th>
        <th>备注</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    </tbody>
</table>

<style type="text/css">
    #result-table .count {
        display: inline-block;
        cursor: pointer;
        background-color: #0e90d2;
        line-height: 20px;
        padding: 0px 4px 0px 4px;
        border-radius: 8px;
        color: #fff;
        font-weight: bold;
    }
</style>

<script>
    // 拉取会员层级配置信息
    function queryLayers() {
        Layer.config = {};
        Layer.query(undefined, function(r) {
            var arr = Layer.sort(r);
            fillTables(arr);
        });
    }
    queryLayers();
    parent.queryLayers = queryLayers;

    function fillTables(list) {
        var table = $("#result-table tbody"); table.empty();

        for (var i in list) {
            var d = list[i];
            var tr = $("<tr></tr>");
            tr.append("<td class='id'>" + d.level + "</td>");
            tr.append("<td>" + d.name + "</td>");
            tr.append("<td>" + new Date(d.registerStart).Format("yyyy-MM-dd") + "</td>");
            tr.append("<td>" + new Date(d.registerEnd).Format("yyyy-MM-dd") + "</td>");
            tr.append("<td>" + d.depositCount + "</td>");
            tr.append("<td>" + d.depositSum/100 + "</td>");
            tr.append("<td>" + d.depositMax/100 + "</td>");
            tr.append("<td>" + d.withdrawCount + "</td>");
            tr.append("<td>" + d.withdrawSum/100 + "</td>");


            tr.append("<td class='stat' style='text-decoration:underline'><a class='count' href='#'>" + d.userCount + "</a></td>");
            tr.append("<td>" + (d.memo || '') + "</td>");
            
            // 操作
            var l = '<td><button value="__v__" class="edit">编辑</button> \
                <button value="__v__" class="detail">详情</button> \
                <button value="__v__" class="delete">删除</button> \
                </td>';
            l = l.replace(/__v__/g, d.level);
            tr.append(l);
            table.append(tr);

            // 点击层级数量的处理
            table.find(".stat").click(function(e) {
                var id = $(e.currentTarget).parent().find(".id").html();
                context.center.layerOper = 'list';
                context.center.layer = id;
                PageHistory.load("用户管理", "会员", false);
            });
        }

        // 编辑的处理
        $("#result-table button.edit").click(function(e) {
            var id = $(e.currentTarget).attr("value");
            for (var i in list) {
                if (list[i].level == id) {
                    context.center.layer = list[i];
                    context.center.layerOper = "edit";
                    Util.addPopUp("add_layer", "add_layer", 600);
                    return;
                }
            }
        });

        // 删除的处理
        $("#result-table button.delete").click(function(e) {
            var id = $(e.currentTarget).attr("value");
            if (confirm("确定删除此层级配置吗？")) {
                Layer.remove(id);
                queryLayers();
            }
        });

        // 查看详情
        $("#result-table button.detail").click(function(e) {
            var id = $(e.currentTarget).attr("value");
            for (var i in list) {
                if (list[i].level == id) {
                    context.center.layer = list[i];
                    context.center.layerOper = "detail";
                    Util.addPopUp("add_layer", "add_layer", 600);
                    return;
                }
            }
        });
    }

    // 添加分层
    $("button.add-layer").click(function() {
        context.center.layerOper = "add";
        context.center.layer = null;
        Util.addPopUp("add_layer", "add_layer", 600);
    });

    // 锁定用户层级
    $("button.lock-layer").click(function() {
        context.center.user = null;
        Util.addPopUp("lock_layer", "lock_layer", 320);
    });

    // 匹配用户层级
    $("button.refresh-layer").click(function() {
        if (!confirm("本操作会大量占用服务器资源，执行耗时，确定执行？")) return;
        startLoading();
        Layer.repair(function() {
            stopLoading();
            Layer.config = {};
            queryLayers();
        })
    });
</script>